import BaseInput from "@/components/ProForm/BaseInput.vue";
import BaseCascader from '@/components/ProForm/BaseCascader.vue'
import BaseCheckBox from '@/components/ProForm/BaseCheckBox.vue'
import BaseColorPicker from '@/components/ProForm/BaseColorPicker.vue'
import BaseDatePicker from '@/components/ProForm/BaseDatePicker.vue'
import BaseDateTimePicker from '@/components/ProForm/BaseDateTimePicker.vue'
import BaseInputNumber from '@/components/ProForm/BaseInputNumber.vue'
import BaseRadio from '@/components/ProForm/BaseRadio.vue'
import BaseSelect from '@/components/ProForm/BaseSelect.vue'
import BaseSwitch from '@/components/ProForm/BaseSwitch.vue'
import BaseTimePicker from '@/components/ProForm/BaseTimePicker.vue'
import BaseTimeSelect from '@/components/ProForm/BaseTimeSelect.vue'
import BaseUpload from '@/components/ProForm/BaseUpload.vue'
import BaseDropdown from '@/components/ProForm/BaseDropdown.vue'
import { reactive } from "vue";




const options = []
export const addeditConfig = {
    formProps: { // 表单属性
        labelPosition: 'right',
        labelWidth: 'auto',
        row:true,
    },
    formItems: [{
            name: BaseInput,
            props: { 
                label: '名字',
                prop: 'name',
                borderBottom: true,
                span:12,
            },
            elProps: { 
                placeholder: '',
                clearable:true,
            },
            value: '' 
        },
       {
                name: BaseSelect,
                options: options,
                props: {
                    label: '課程分類',
                    prop: 'course_category_id',
                    span: 12,
                },
                elProps: {
                    placeholder: '',
                    clearable: true,
                    multiple: false,
                },
                value: ''
            },
        {
            name: BaseSelect,
            options: [{
                    value: 1,
                    label: '正常',
                },
                {
                    value: -1,
                    label: '禁用',
                },
            ],
            props: {
                label: '狀態',
                prop: 'status',
                span: 12,
            },
            elProps: {
                placeholder: '',
                clearable: true,
                multiple: false,
            },
            value: ''
        },
        {
            name:BaseDatePicker,
            props: {
                label: '上課日期',
                prop: 'date',
                span: 12,
            },
            elProps: {
                placeholder: '',
                clearable: true,
                startPlaceholder: "開始時間",
                type:"daterange",
                endPlaceholder: "結束時間",
                format: "YYYY-MM-DD",
                valueFormat: "YYYY-MM-DD",
            },
            value: ''
        },
        {
            name:BaseTimeSelect, 
            props: {
                label: '上課時間',
                prop: 'time',
                span: 12,
            },
            elProps: {
                start:"07:00",
                step:"00:15",
                end:"23:59",
            },
            value: ''
        },
        // {
        //     name:BaseDateTimePicker,
        //     props: {
        //         label: '下課時間',
        //         prop: 'quittingtime',
        //         span: 12,
        //     },
        //     elProps: {
        //         placeholder: '',
        //         clearable: true,
        //         startPlaceholder: "開始時間",
        //         type:"datetime",
        //         endPlaceholder: "結束時間",
        //         format: "YYYY-MM-DD HH:mm:ss",
        //         valueFormat: "YYYY-MM-DD HH:mm:ss",
        //     },
        //     value: ''
        // },
        {
            name: BaseInputNumber,
            props: { 
                label: '上課人數',
                prop: 'num',
                borderBottom: true,
                span:12,
            },
            elProps: { 
                placeholder: '',
                clearable:true,
            },
            value: 0
        },
        {
            name: BaseSelect,
            options: options,
            props: {
                label: '上課教練',
                prop: 'admins_id',
                span: 12,
            },
            elProps: {
                placeholder: '',
                clearable: true,
                multiple: true,
            },
            value: ''
        },
        {
            name: BaseSelect,
            options: options,
            props: {
                label: '上課教室',
                prop: 'classroom_id',
                span: 12,
            },
            elProps: {
                placeholder: '',
                clearable: true,
                multiple: false,
            },
            value: ''
        },
        {
            name: BaseSelect,
            options: [
                {label:'星期一',value:'1'},
                {label:'星期二',value:'2'},
                {label:'星期三',value:'3'},
                {label:'星期四',value:'4'},
                {label:'星期五',value:'5'},
                {label:'星期六',value:'6'},
                {label:'星期日',value:'7'},
            ],
            props: {
                label: '星期',
                prop: 'week',
                span: 12,
            },
            elProps: {
                placeholder: '',
                clearable: true,
                multiple: true,
            },
            value: ''
        },
        {
            name: BaseInput,
            props: { 
                label: '備註',
                prop: 'remark',
                borderBottom: true,
                span:12,
            },
            elProps: { 
                placeholder: '',
                clearable:true,
                type:'textarea'
            },
            value: ''
        },
        {
            name: BaseInput,
            props: { 
                label: '摘要',
                prop: 'digest',
                borderBottom: true,
                span:12,
            },
            elProps: { 
                placeholder: '',
                clearable:true,
                type:'textarea'
            },
            value: ''
        },

        {
            name: BaseInputNumber,
            props: { 
                label: '排序',
                prop: 'sort',
                borderBottom: true,
                span:12,
            },
            elProps: { 
                placeholder: '',
                clearable:true,
            },
            value: 0
        },
        {
            name: BaseInput,
            props: { 
                label: '價格',
                prop: 'price',
                borderBottom: true,
                span:12,
            },
            elProps: { 
                type:'number',
                placeholder: '',
                clearable:true,
            },
            value: ''  
        }
    ],
    rules: {
        name:{
            required:true,
            message:'请输入課程名稱',
            trigger: ['blur', 'change'],
        },
        course_category_id:{
            required:true,
            message:'请選擇課程分類',
            trigger: ['blur', 'change'],
        },
        status:{
            required:true,
            message:'请選擇課程狀態',
            trigger: ['blur', 'change'],
        },
        time:{
            required:true,
            message:'请選擇上課時間-下課時間',
            trigger: ['blur', 'change'],
        },
        // quittingtime:{
        //     required:true,
        //     message:'请選擇下課時間',
        //     trigger: ['blur', 'change'],
        // },
        num:{
            required:true,
            message:'请輸入上课人数',
            trigger: ['blur', 'change'],
        },
        admins_id:{
            required:true,
            message:'请選擇上課教練',
            trigger: ['blur', 'change'],
        },
        classroom_id:{
            required:true,
            message:'请選擇上課教室',
            trigger: ['blur', 'change'],
        },
        week:{
            required:true,
            message:'请選擇星期幾上課',
            trigger: ['blur', 'change'],
        },
        sort:{
            required:true,
            message:'请輸入課程排序號',
            trigger: ['blur', 'change'],
        },
        price:{
            required:true,
            message:'请输入課程價格',
            trigger: ['blur', 'change'],
        },
        date:{
            required:true,
            message:'请選擇上課日期',
            trigger: ['blur', 'change'],
        }
    }
}
